import React, { Component } from 'react';
import { Modal, Form, Input, message,DatePicker} from 'antd';
import axios from 'axios';

export default class Addjoke extends Component {
  state={addTime:''}

  formRef = React.createRef();//重置表单没有实现

  cancelForm = () => {
    this.formRef.current.resetFields();
    this.props.close()
  }

  
  handleSubmit = () => {
    let that=this;

    this.formRef.current.validateFields()
      .then(values => {
        message.info('添加成功！');
        this.cancelForm();
        
        values.joke_time=this.state.addTime;
  
        const token = localStorage.getItem('token');
        if (token) {

          axios.post("https://wx.xxmtcds.top:2333/admin/joke", values, {
            headers: { 'authorization': `${token}` }
          })
            .then(function (response) {
              console.log(response);
              that.props.get();
            })
            .catch(err => console.log(err))
        }
      }).catch(errorInfo => {
        message.error('添加失败！');
      })
  }
  onChange=(date, dateString)=>{
    // console.log(dateString);
    this.setState({addTime:dateString})
  }



  render() {
    return (

      <Modal
        title='添加一个笑话吧'
        okText='确定'
        cancelText='取消'
        visible={this.props.visible}
        onCancel={this.cancelForm }
        onOk={ this.handleSubmit}>
        <Form
          ref={this.formRef}
          layout="horizontal"
          labelCol={{ span: 6 }}//不能超过24
          wrapperCol={{ span: 12 }}
          >

          <Form.Item name="joke_time" label='时间'>
            <DatePicker onChange={this.onChange} placeholder='选择添加日期'/>
          </Form.Item>
          <Form.Item name="joke_content" label='内容'
            rules={[{
                required: true,
                message: '请输入内容',
              }]}>
            <Input.TextArea allowClear showCount minRows='5' maxLength={200} />
             
          </Form.Item>
        </Form>
      </Modal>


    );
  }
}



